import { defineConfig, presetAttributify, presetTypography, presetUno, transformerVariantGroup } from 'unocss';
import presetRemToPx from '@unocss/preset-rem-to-px';

export default defineConfig({
	presets: [presetUno(), presetTypography(), presetAttributify(), (presetRemToPx as any)()],
	/** 支持这样组合的写法 before:(bg-red w-6px h-6px rounded-full inline-block content-['']) */
	transformers: [transformerVariantGroup()],
	// 注入css
	preflights: [],
	// 默认生成类名
	safelist: [],
	rules: [
		[
			/^transition-\[(.+)]$/,
			([, value]) => ({
				transition: value.replace(/_/g, ' '), // 将 "_" 替换为 " "
			}),
		],
		['border-235', { border: 'var(--border)' }],
		[
			'scrollbar-hide',
			{
				'scrollbar-width': 'none', // Firefox
			},
		],
	],

	shortcuts: [
		{
			'flex-center': 'flex items-center justify-center',
			'bg-ccr': 'bg-center bg-cover',
			'wt-hover': 'cursor-pointer  rounded-[4px]!  font-400 hover:bg-[#ddd]',
		},
	],
});
